<template>
    <div class="v-video-bar">
        <vprogress
            :currentTime="currentTime"
            :duration="duration"
            v-on:goto="goto"
        ></vprogress>
        <vbutton
            :paused="paused"
            :hasNext="hasNext"
            :currentTime="currentTime"
            :duration="duration"
            v-on:play="play"
            v-on:next="next"
        ></vbutton>
    </div>
</template>

<script>
    'use strict';

    import {baseUtil} from "../../common/js/BaseUtil";
    import vprogress from './v-progress';
    import vbutton from './v-button';

    export default {
        name: "v-video-bar",
        components: {vprogress,vbutton},
        props: {
            currentTime: {
                type: Number,
                default: () => {
                    return 0;
                },
                desc: '当前的播放时间'
            },
            loadTime: {
                type: Number,
                default: () => {
                    return 0;
                },
                desc: '加载时长'
            },
            duration: {
                type: Number,
                default: () => {
                    return 0;
                },
                desc: '总时长'
            },
            paused: {
                type: Boolean,
                default() {
                    return true;
                },
                desc: '是否暂停'
            },
            hasNext: {
                type: Boolean,
                default() {
                    return false;
                },
                desc: '是否存在下一个视频'
            }
        },
        data() {
            return {
                // currentTime: 10,
                // duration: 2000
            }
        },
        computed: {},
        methods: {
            play() {
                this.$emit('play', {});
            },
            next() {
                this.$emit('next', {});
            },
            goto(time) {
                this.$emit('goto', time)
            },
        },
        created() {

        },
        mounted() {

        }
    }
</script>

<style lang="scss" scoped>

</style>
